import React from 'react';
import {Layout, Space} from 'antd';
import Canvas from "@/pages/WorkFlowDesigner/Canvas";
import Toolbar from "@/pages/WorkFlowDesigner/Toolbar/Toobar";

const {Header, Content} = Layout;

const headerStyle: React.CSSProperties = {
    textAlign: 'center',
    color: '#fff',
    height: 64,
    paddingInline: 50,
    lineHeight: '64px',
    backgroundColor: '#7dbcea',
    opacity: 0.85    // 不透明度
};

const contentStyle: React.CSSProperties = {
    textAlign: 'center',


    minHeight: 120,
    // lineHeight: '120px',
    // backgroundColor: '#f0f0f0',
};

export default React.memo(() => (
    <Space direction="vertical" style={{width: '100%'}}>
        <Layout>
            <Header style={headerStyle}><Toolbar/></Header>
            <Content style={contentStyle}><Canvas/></Content>
        </Layout>

    </Space>
));
